<template>
    <div>
        <div style="display: flex;">
            <div style="margin: 0 30px;">
                <el-button type="primary" @click="handleButtonAdd()">+ 添加</el-button>
            </div>
            <div>
                <el-select v-model="wd_id" placeholder="请选择" @change="selectType">
                    <el-option v-for="(item, index) in typeList" :key="index" :label="item.type" :value="item.id">
                    </el-option>
                </el-select>
            </div>
            <!-- <div>
            <el-select v-model="ball_id" placeholder="请选择"  @change="changeBall">
                <el-option v-for="(item, index) in ballList" :key="index" :label="item.type" :value="item.id">
                </el-option>
            </el-select>
        </div> -->
        </div>

        <el-table :data="matchAI" style="width: 100%" :header-cell-style="{ 'text-align': 'center' }">
            <el-table-column prop="id" label="ID" align="center">

            </el-table-column>

            <el-table-column prop="create_time" label="显示时间" align="center">
            </el-table-column>
            <el-table-column prop="update_time" label="更新时间" align="center">
            </el-table-column>
            <el-table-column prop="teamA" label="主队" align="center">
            </el-table-column>
            <el-table-column prop="teamB" label="客队" align="center">
            </el-table-column>
            <template v-if="ball_id == 2">
                <el-table-column prop="total_score" label="预计总分" align="center">
                </el-table-column>
                <el-table-column prop="goalLine" label="让球分" align="center">
                </el-table-column>
            </template>
            <el-table-column prop="browse" label="是否有人查看" align="center">
                <template slot-scope="scope">
                    <span v-if="scope.row.browse == 0">
                        否
                    </span>
                    <span v-else>
                        {{ scope.row.browse }}
                    </span>
                </template>
            </el-table-column>

            <el-table-column label="操作" align="center">
                <template slot-scope="scope">
                    <el-button v-if="!scope.row.browse" size="small" type="primary" @click="handleButton1Click(scope.row)">修改</el-button>
                    <el-button size="small" type="danger" @click="handleButton2Click(scope.row)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>

        <div class="tabListPage">
            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                :current-page="currentPage" :page-sizes="pageSizes" :page-size="PageSize"
                layout="total, sizes, prev, pager, next, jumper" :total="totalCount">
            </el-pagination>
        </div>

        <div>
            <el-dialog :title="ruleForm.id ? '修改' : '添加'" :visible.sync="dialogTableVisible" :before-close="closeForm"
                :close-on-click-modal="false" :close-on-press-escape="false">
                <!-- <div>
                    <span style="display: inline-block;">
                        <el-input style="margin-right: 20px;" v-model="zhuName" placeholder="请输入主队全称"></el-input>
                    </span>
                    <span style="margin: 20px 20px;display: inline-block;">
                        <el-input style="margin-right: 20px;" v-model="keName" placeholder="请输入客队全称"></el-input>
                    </span>
                    <div @click="upOdds" style="margin: 0 0 20px 0;">点击更新赔率(无法获取赔率时使用)</div>
                </div> -->

                <el-form :model="ruleForm" ref="ruleForm" label-width="100px" class="demo-ruleForm">
                    <el-form-item label="选择类型" prop="name">
                        <el-select v-model="ruleForm.typeid" placeholder="请选择" @change="selectChange">
                            <el-option v-for="(item, index) in typeList" :key="index" :label="item.type"
                                :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>

                    <el-form-item label="赛事选择">
                        <!-- <el-select v-model="ruleForm.matchid" placeholder="请选择" @change="selectMatch">
                            <el-option v-for="(item, index) in matchList" :key="index" :label="item.away_name+'vs'+item.home_name" :value="item.id"></el-option>
                        </el-select> -->
                        <el-input style="margin-right: 20px;" v-model="home_name" placeholder="请输入主队名称"
                            @input="getMatchList()"></el-input>
                    </el-form-item>

                    <el-form-item label="赛队A">
                        <!-- <el-select v-model="ruleForm.matchid" placeholder="请选择" @change="selectMatch">
                            <el-option v-for="(item, index) in matchList" :key="index" :label="item.away_name+'vs'+item.home_name" :value="item.id"></el-option>
                        </el-select> -->
                        <el-input style="margin-right: 20px;" v-model="ruleForm.teamA" placeholder="请输入球队名称"></el-input>

                    </el-form-item>

                    <el-form-item label="赛队B">
                        <!-- <el-select v-model="ruleForm.matchid" placeholder="请选择" @change="selectMatch">
                            <el-option v-for="(item, index) in matchList" :key="index" :label="item.away_name+'vs'+item.home_name" :value="item.id"></el-option>
                        </el-select> -->
                        <el-input style="margin-right: 20px;" v-model="ruleForm.teamB" placeholder="请输入球队名称"></el-input>
                    </el-form-item>


                    <div style="display:flex;flex-wrap: wrap;justify-content: space-between;">

                        <div v-for="(items, index) in teamMatch" :key="index" class="fourteenClass"
                            @click.stop="toChange(items.match_id, items)">
                            <div>
                                <span>{{ items.home_team_name }} VS {{ items.away_team_name }}</span>
                            </div>

                        </div>

                    </div>
                    <el-form-item label="大球小球" v-if="ruleForm.typeid == 3">

                        <el-radio v-model="ruleForm.point" :label="1">大球</el-radio>
                        <el-radio v-model="ruleForm.point" :label="2">小球</el-radio>

                    </el-form-item>

                    <template v-if="ruleForm.typeid == 4">

                        <el-form-item label="预测A">
                            <!-- <el-select v-model="ruleForm.matchid" placeholder="请选择" @change="selectMatch">
                            <el-option v-for="(item, index) in matchList" :key="index" :label="item.away_name+'vs'+item.home_name" :value="item.id"></el-option>
                        </el-select> -->
                            <el-input style="margin-right: 20px;" v-model="ruleForm.predictionA"
                                placeholder="请输入比分"></el-input>
                            <el-input style="margin-right: 20px;" v-model="ruleForm.predictionA_probability"
                                placeholder="请输入比分概率"></el-input>

                        </el-form-item>


                        <el-form-item label="预测B">
                            <!-- <el-select v-model="ruleForm.matchid" placeholder="请选择" @change="selectMatch">
                            <el-option v-for="(item, index) in matchList" :key="index" :label="item.away_name+'vs'+item.home_name" :value="item.id"></el-option>
                        </el-select> -->
                            <el-input style="margin-right: 20px;" v-model="ruleForm.predictionB"
                                placeholder="请输入比分"></el-input>
                            <el-input style="margin-right: 20px;" v-model="ruleForm.predictionB_probability"
                                placeholder="请输入比分概率"></el-input>

                        </el-form-item>
                    </template>


                    <template v-if="ruleForm.typeid == 3">
                        <el-form-item label="盘口">
                           {{  panko  }}
                        </el-form-item>
                        <el-form-item label="0-7球概率">
                            <!-- <el-select v-model="ruleForm.matchid" placeholder="请选择" @change="selectMatch">
                            <el-option v-for="(item, index) in matchList" :key="index" :label="item.away_name+'vs'+item.home_name" :value="item.id"></el-option>
                        </el-select> -->
                            <el-input style="width:130px;margin-right:20px;" v-for="(item, index) in sizeList"
                                :key="index" v-model="sizeList[index]" :placeholder="`请输入${index}球概率`"></el-input>
                            <!-- <el-input style="width:130px" v-model="ruleForm.predictionB_probability" placeholder="请输入进球概率"></el-input> -->

                        </el-form-item>
                    </template>

                    <template v-if="ruleForm.typeid == 4">
                        <el-form-item label="比分概率">

                             <div v-for="(item, index) in bifenList" :key="index">
                                <span style="margin-right:10px">比分{{ index + 1 }}:</span>
                                <el-input style="width:130px;margin-right:20px;" 
                                 v-model="bifenList[index].score" :placeholder="`请输入比分`"></el-input>
                                 <el-input style="width:130px;margin-right:20px;" 
                                 v-model="bifenList[index].probability" :placeholder="`请输入比分概率`"></el-input>
                                </div>  

                             
                                
                                
                                

                            
                            <!-- <el-input style="width:130px" v-model="ruleForm.predictionB_probability" placeholder="请输入进球概率"></el-input> -->

                        </el-form-item>
                    </template>

                    <el-form-item label="显示时间">
                        <el-date-picker type="datetime" v-model="renderDate"></el-date-picker>

                        </el-form-item>

                        

                    <!-- <el-form-item label="总进球数">
                      
                        <el-input style="margin-right:20px;" v-model="ruleForm.total_goal" placeholder="请填写"></el-input>
                        
                    </el-form-item> -->



                </el-form>
                <div style="text-align: right;">
                    <el-button @click="dialogTableVisible = false">取消</el-button>
                    <el-button type="primary" @click="clickConfirm(1)">确认</el-button>
                </div>
            </el-dialog>
        </div>

    </div>
</template>

<script>
import { hqMatcheList, hqOddsData, aiPlayList, aiListDelete, aiSaveData, baskList, baskListDelete, baskListSave, baskListOdds, footUpOdds, baskUpOdd, updateOdds, updateOdds1, automaticList , addAndEditAutomatic , removeEditAutomatic } from '../../../libs/api'
import data from '../pdf/content'
export default {
    data() {
        return {
            dialogTrue1: false,
            bigSmall: '',
            modifyOdds: [{ label: '主胜', is_recommend: false, value: '' }, { label: '平', is_recommend: false, value: '' }, { label: '主负', is_recommend: false, value: '' }],
            ballOdds: [{ label: '胜', is_recommend: false }, {}, { label: '负', is_recommend: false }],
            baskBigsmall: [{ label: '小', is_recommend: false }, {}, { label: '大', is_recommend: false }],
            home_winning: [{ label: '1-5', value: '7.70', id: 1 }, { label: '6-10', value: '7.70', id: 2 }, { label: '11-15', value: '7.70', id: 3 }, { label: '16-20', value: '7.70', id: 4 }, { label: '21-25', value: '7.70', id: 5 }, { label: '26+', value: '7.70', id: 6 }],
            away_winning: [{ label: '1-5', value: '2.70' }, { label: '6-10', value: '2.70' }, { label: '11-15', value: '2.70' }, { label: '16-20', value: '2.70' }, { label: '21-25', value: '2.70' }, { label: '26+', value: '2.70' }],
            baskData: [],
            bigSmallData: [],
            typeList: [{ type: '大小球', id: 3 }, { type: '比分概率', id: 4 }],
            ruleForm: {
                id: '',
                point: 1,
                typeid: 3,
                matchid: '',
                sort: '',
                plnned: 2,
                Mscore: 2,
                goalLine: '',
                total_goal: '',
                predictionA: '',
                predictionA_probability: '',
                predictionB: '',
                predictionB_probability: ''
            },
            dialogTableVisible: false,
            dialogTrue: false,
            matchList: [
                { away_name: "桑德兰", home_name: "谢周三", id: 1023 },
                { away_name: "加的夫", home_name: "阿斯顿维拉", id: 1024 },
                { away_name: "拜仁", home_name: "斯图加", id: 1025 },
                { away_name: "菲尔特", home_name: "杜塞尔", id: 1026 }
            ],
            sizeList: ['','','','','','','',''],
            bifenList: [{ "score": "", "probability": "" }, { "score": "", "probability": "" }, { "score": "", "probability": "" }, { "score": "", "probability": "" }, { "score": "", "probability": "" }, { "score": "", "probability": "" }],
            home_name: '',
            teamMatch: [],
            r_result: ['胜', '平', '负'],
            matchID: '',
            oddsData: [],
            matchAI: [],
            alltabData: [],
            totalCount: 1,
            PageSize: 10,
            pageSizes: [5, 10],
            currentPage: 1,
            wd_id: 3,
            ball_id: 1,
            changeTeam: {},
            selectIndex: 7,
            selectIndexBask: 7,
            vpoint: 9,
            modifyData: {},
            modify_id: 9,
            checkedAll: [],
            viewpoint_a: '',
            viewpoint_b: '',
            ballList: [{ type: '足球', id: 1 }, { type: '篮球', id: 2 }],
            ballID: 1,
            showType: true,
            baskDataOdds: {},
            selectBaskScore: 7,


            t_id: '',
            s_id: '',
            fenchaA: '',
            fenchaB: '',
            xishu: '',
            selectedItems: [],
            showOddsNull: 0,

            rangfen: '',
            bigfen: '',
            horA: 1,
            zhuName: '',
            keName: '',
            isFjc: false,
            updateForm: {
                name1: '',
                name2: '',
                type: 1,
                id: ''
            },
            panko: '',
            renderDate: new Date()
        }
    },
    created() {
        // this.modify_id = this.wd_id
        this.getAIlist()
    },
    methods: {
        handleButton3Click(v) {
            this.dialogTrue1 = true;
            this.updateForm.name1 = v.teamA;
            this.updateForm.name2 = v.teamB;
            this.updateForm.id = v.id;
            this.updateForm.type = this.wd_id
        },
        closedModel1() {
            this.dialogTrue1 = false;
        },
        closedModel() {
            this.dialogTrue = false
        },
        handleButton1Click(e) {
            
            this.ruleForm = e;
            this.ruleForm.typeid  = this.wd_id
            this.matchID = e.match_id;
            this.renderDate = new Date(e.create_time)
            if (this.ruleForm.typeid == 4) {
                this.bifenList = JSON.parse(this.ruleForm.distribution) 
                
            } else {
                let oddres = JSON.parse(this.ruleForm.odds);

                let strObj = oddres.find(item => item.is_recommend)
                this.oddsData = JSON.parse(this.ruleForm.odds)

                try {
                    this.panko = this.oddsData.find(item => item.label == '盘口')['value']
                    
                } catch {

                }
                
                if (strObj.label == '大球') {
                    this.ruleForm.point = 1
                } else {
                    this.ruleForm.point = 2
                }


                this.sizeList = JSON.parse(this.ruleForm.distribution).map(item => item.probability)
            }
            this.dialogTableVisible = true
        },
        handleButton2Click(e) {
            removeEditAutomatic({
                id: e.id,
                type: this.wd_id
            }).then(res => {
                this.getAIlist()
                this.dialogTableVisible = false;
                this.$message.success("删除成功")
            })
        },
        selectType(e) {
            this.wd_id = e
            this.ruleForm.typeid = e
            console.log(this.wd_id)
            this.getAIlist()
        },
        // 显示第几页
        handleCurrentChange(val) {
            // 改变默认的页数
            this.currentPage = val
            this.getAIlist()
        },
        // 分页
        // 每页显示的条数
        handleSizeChange(val) {
            // 改变每页显示的条数
            this.PageSize = val
            // 改变每页显示的条数时，要将页码显示到第一页
            this.currentPage = 1
            this.getAIlist()
        },
        handleButtonAdd() {
            this.ruleForm.id = '';
            this.matchID = ''
            this.ruleForm.teamA = ''
            this.ruleForm.teamB = ''
            this.panko = ''
            this.renderDate = new Date()
            this.dialogTableVisible = true
        },
        selectChange(e) {
            console.log(e)
            this.modify_id = e
            // this.wd_id = e
        },
        selectBall(e) {
            console.log(e)
            this.ballID = e

        },
        closeForm() {
            this.dialogTableVisible = false
        },
        selectMatch() {
            console.log(this.ruleForm.matchid)
        },
        clickDelete() {
            console.log('取消')
        },
        clickConfirm() {
             
            this.ruleForm.create_time = new Date(this.renderDate).getTime() / 1000;
            this.ruleForm.type = this.ruleForm.typeid;
            this.ruleForm.match_id = this.matchID;
            if (this.ruleForm.typeid == 3) {
               


                console.log(this.oddres)
                
                this.oddsData.forEach(item => {
                        
                    if (this.ruleForm.point == 1) {
                        if (item.label == '大球') {
                            item.is_recommend = 1
                        } else {
                            item.is_recommend = 0
                        }
                    } else {

                        if (item.label == '小球') {
                            item.is_recommend = 1
                        } else {
                            item.is_recommend = 0
                        }

                    }

                    });

                this.ruleForm.odds = JSON.stringify(this.oddsData);    

               

                this.ruleForm.distribution = JSON.stringify(this.sizeList.map((item, index) => {

                    return {
                        goal: index,
                        probability: item
                    }

                }))

            } else {



                this.ruleForm.distribution = JSON.stringify(this.bifenList)
                



            }

        
            addAndEditAutomatic({
                ...this.ruleForm
            }).then(res => {
                this.dialogTableVisible = false;
                this.getAIlist()

            })   

            
           
        },
        // 更新足球赔率
        getMatchList() {
            console.log(this.home_name)
            if (this.home_name == '') {
                this.teamMatch = []
                this.oddsData = []
            } else {
                hqMatcheList({
                    limit: 10,
                    lx: this.ballID,
                    name: this.home_name,
                    page: 1
                }).then(res => {
                    console.log(res)
                    this.teamMatch = res.data.list.data
                })
            }
        },
        async getAIlist() {


            const res = await automaticList({
                list_rows: this.PageSize,
                type: this.wd_id,
                page: this.currentPage
            })

            this.matchAI = res.data.data
            this.alltabData = res.data.data
            this.totalCount = res.data.total



        },
        getOdds() {

            if (this.ruleForm.typeid != 3) {
                return
            }

            hqOddsData({
                lot_lx: 3,
                // lx:1,
                lx: 1,
                match_id: this.matchID
            }).then(res => {
                console.log((Array.isArray(res.data.odds) && res.data.odds.length))
                if (Array.isArray(res.data.odds) && res.data.odds.length) {
                    this.oddsData = res.data.odds[0]
                    // console.log( this.oddsData.find(item => item.label == '盘口'))
                    this.panko = this.oddsData.find(item => item.label == '盘口')['value']

                } else {

                    this.$message.error("没有盘口，已重置")
                    this.matchID = '';
                    this.ruleForm.teamA = ''
                    this.ruleForm.teamB = ''
                }
                // console.log(res.data)
                
                console.log(this.oddsData)

            })
        },
        toChange(id, item) {
            this.matchID = id;
            this.ruleForm.matchid = id;
            this.ruleForm.teamA = item.home_team_name
            this.ruleForm.teamB = item.away_team_name
            let arr = []
            arr.push(item)
            this.teamMatch = arr

            this.getOdds()
        },
        onSelectBask(e, j) {
            console.log(e)
            console.log(j)
            this.selectIndexBask = j
            if (j == 0) {
                this.t_id = 2
                this.modifyData.outcome = 2
            } else if (j == 2) {
                this.t_id = 1
                this.modifyData.outcome = 1
            }
        },
        onSelectBaskScore(e, j) {
            console.log(e)
            console.log(j)
            this.selectBaskScore = j

            if (j == 0) {
                this.s_id = 2
                this.modifyData.size = 2
            } else if (j == 2) {
                this.s_id = 1
                this.modifyData.size = 1
            }
        },
        onSelect1(e, j) {
            if (this.ruleForm.typeid == 1) {
                this.selectIndex = j
                if (j == 0) {
                    this.vpoint = 1
                } else if (j == 1) {
                    this.vpoint = 3
                } else {
                    this.vpoint = 2
                }
            } else {
                console.log(99)
                console.log(e)
                e.is_recommend = !e.is_recommend
                this.checkedAll.push(e)
                this.checkedAll = Array.from(new Set(this.checkedAll))
                console.log(this.checkedAll)
                let arr = []
                for (var i = 0; i < this.checkedAll.length; i++) {
                    // console.log(this.checkedAll[i])
                    if (this.checkedAll[i].is_recommend == true) {
                        arr.push(this.checkedAll[i])
                    }

                }
                arr.sort((a, b) => parseInt(a.index) - parseInt(b.index));
                console.log("这是8888", arr)
                if (arr.length > 1) {
                    if (arr[0].is_recommend == true && arr[1].is_recommend == true && arr[0].label == '主胜' && arr[1].label == '平局') {
                        this.vpoint = 1
                        this.viewpoint_a = 3
                    } else if (arr[0].is_recommend == true && arr[1].is_recommend == true && arr[0].label == '主胜' && arr[1].label == '客胜') {
                        this.vpoint = 1
                        this.viewpoint_a = 2
                    } else if (arr[0].is_recommend == true && arr[1].is_recommend == true && arr[0].label == '平局' && arr[1].label == '客胜') {
                        this.vpoint = 3
                        this.viewpoint_a = 2
                    }
                    // if(arr[1].is_recommend==true){
                    //     this.viewpoint_a = 1
                    // }else if(arr[1].is_recommend==true){
                    //     this.viewpoint_a = 2
                    // }else if(arr[1].is_recommend==true){
                    //     this.viewpoint_a = 3
                    // }
                    console.log(this.viewpoint_a)
                    console.log(this.vpoint)
                } else if (arr.length == 1) {
                    if (arr[0].label == '主胜') {
                        this.vpoint = 1
                    } else if (arr[0].label == '客胜') {
                        this.vpoint = 2
                    } else if (arr[0].label == '平局') {
                        this.vpoint = 3
                    }
                    console.log(this.vpoint)
                }
                // if(arr.length>1){
                //     if(arr[0].label=='主胜'){
                //         this.vpoint = 1
                //     }else if(arr[0].label=='主负'){
                //         this.vpoint = 2
                //     }else if(arr[0].label=='平局'){
                //         this.vpoint = 3
                //     }
                //     if(arr[1].label=='主胜'){
                //         this.viewpoint_a = 1
                //     }else if(arr[1].label=='主负'){
                //         this.viewpoint_a = 2
                //     }else if(arr[1].label=='平局'){
                //         this.viewpoint_a = 3
                //     }
                //     console.log(this.viewpoint_a)
                //     console.log(this.vpoint)
                // }else if(arr.length==1){
                //     if(arr[0].label=='主胜'){
                //         this.vpoint = 1
                //     }else if(arr[0].label=='主负'){
                //         this.vpoint = 2
                //     }else if(arr[0].label=='平局'){
                //         this.vpoint = 3
                //     }
                //     console.log(this.vpoint)
                // }
            }
        },
        onSelect2(e, j) {
            if (this.ruleForm.typeid == 1) {
                console.log(e)
                console.log(this.modifyOdds)
                this.selectIndex = j
                if (j == 0) {
                    this.vpoint = 1
                } else if (j == 1) {
                    this.vpoint = 3
                } else {
                    this.vpoint = 2
                }
            } else {
                console.log(99)
                console.log(e)
                e.is_recommend = !e.is_recommend
                console.log(this.modifyOdds)
                if (this.modifyOdds[0].is_recommend == true && this.modifyOdds[1].is_recommend == true) {
                    this.vpoint = 1
                    this.viewpoint_a = 3
                } else if (this.modifyOdds[0].is_recommend == true && this.modifyOdds[2].is_recommend == true) {
                    this.vpoint = 1
                    this.viewpoint_a = 2
                } else if (this.modifyOdds[1].is_recommend == true && this.modifyOdds[2].is_recommend == true) {
                    this.vpoint = 3
                    this.viewpoint_a = 2
                } else if (this.modifyOdds[0].is_recommend == true) {
                    this.vpoint = 1
                } else if (this.modifyOdds[1].is_recommend == true) {
                    this.vpoint = 3
                } else if (this.modifyOdds[2].is_recommend == true) {
                    this.vpoint = 2
                }
                // if(arr[1].label=='主胜'){
                //     this.viewpoint_a = 1
                // }else if(arr[1].label=='主负'){
                //     this.viewpoint_a = 2
                // }else if(arr[1].label=='平局'){
                //     this.viewpoint_a = 3
                // }
            }
        }
    }
}
</script>

<style>
.cs_class {
    display: flex;
}

.box {
    display: flex;

}

.fourteenClass {
    width: 300px;
    padding: 10px;
    border: 2px solid #D8D8DB;
    margin-bottom: 10px;
}

.fourteenClass_a {
    width: 80px;
    border: 1px solid #aaa;
    text-align: center;
    line-height: 38px;
}

.fourteenClass_a:nth-child(2) {
    border-left: none;
    border-right: none;

}

.bask_class {
    width: 80px;
    border: 1px solid #aaa;
    text-align: center;
    line-height: 38px;
}

.bask_class:nth-child(2) {
    border-left: none;
    /* border-right: none; */
}

.item1 {
    background-color: #3C9CFF;
    color: #fff;
}
</style>